<template>
  <a-modal
    v-model:visible="vdata.visible"
    :maskClosable="false"
    width="41%"
    :title="'本次导入商户异常商户'"
    :footer="null"
    @cancel="onClose"
  >
    <!-- <a-form ref="formRef" layout="vertical" :wrapperCol="{ span: 22 }" :model="vdata.saveObject" :rules="vdata.rules">
        <a-row justify="space-between" type="flex">
          <a-col :span="12">
            <a-form-item label="奖品类型" name="awardType">
              <a-radio-group v-model:value="vdata.saveObject['awardType']" @change="awardTypeChange">
                <a-radio v-if="vdata.awardType.includes(0)" :value="0">卡券</a-radio>
                <a-radio v-if="vdata.awardType.includes(1)" :value="1">实物</a-radio>
                <a-radio v-if="vdata.awardType.includes(2)" :value="2">虚拟券</a-radio>
                <a-radio v-if="vdata.awardType.includes(3)" :value="3">福分</a-radio>
              </a-radio-group>
            </a-form-item>
          </a-col>
          <a-col v-if="props.needLevel" :span="12">
            <a-form-item label="奖品等级" name="awardLevel">
              <a-select v-model:value="vdata.saveObject['awardLevel']" placeholder="奖品等级">
                <a-select-option v-if="vdata.saveObject.awardType === 3" :value="0">安慰奖</a-select-option>
                <a-select-option :value="1" :disabled="props.value.find(item => item.awardLevel === 1)">一等奖</a-select-option>
                <a-select-option :value="2" :disabled="props.value.find(item => item.awardLevel === 2)">二等奖</a-select-option>
                <a-select-option :value="3" :disabled="props.value.find(item => item.awardLevel === 3)">三等奖</a-select-option>
                <a-select-option :value="4" :disabled="props.value.find(item => item.awardLevel === 4)">四等奖</a-select-option>
                <a-select-option :value="5" :disabled="props.value.find(item => item.awardLevel === 5)">五等奖</a-select-option>
                <a-select-option :value="6" :disabled="props.value.find(item => item.awardLevel === 6)">六等奖</a-select-option>
              </a-select>
              <span v-if="vdata.saveObject.awardLevel === 0" class="gz-tip-text">所有的空奖都改为安慰奖，若存在多个安慰奖，则每种安慰奖的中奖率为1/安慰奖总数量</span>
            </a-form-item>
          </a-col>
          <a-col v-if="props.needProbability && vdata.saveObject.awardLevel !== 0" :span="12">
            <a-form-item label="中奖概率" name="awardProbability">
              <a-input-number
                v-model:value="vdata.saveObject['awardProbability']"
                placeholder="中奖概率(0~100)"
                addon-after="%"
                :min="0.01"
                :max="100"
                :precision="2"
              />
            </a-form-item>
          </a-col>
          <a-col v-if="props.needexchangeNum=='ACTE024'" :span="12">
            <a-form-item label="奖品兑换所需积分" name="exchangeShareNum">
              <a-input-number v-model:value="vdata.saveObject['exchangeShareNum']" placeholder="请输入积分" :min="1" />
            </a-form-item>
          </a-col>
        </a-row>
      </a-form> -->
    <!-- <page-header-wrapper> -->
    <a-card class="table-card">
      <!-- <GzSearchForm :searchFunc="searchFunc" :resetFunc="() => { searchData = {} }" searchConditionNum="6">
            <a-form-item>
              <a-input v-model:value="searchData['batchNo']" placeholder="批次号" />
            </a-form-item>
          </GzSearchForm> -->
      <!-- 列表渲染 -->
      <!-- :req-table-data-func="reqTableDataFunc" -->
      <gz-table
        ref="infoTableRef"
        :table-columns="tableColums"
        :init-data="false"
        :dataSource="props.errData"
        :search-data="searchData"
        :scrollX="600"
        :rowKey="'mchNo'"
        :isSkeleton="false"
      />
    </a-card>
    <!-- </page-header-wrapper> -->
    <!-- <div class="drawer-btn-center">
        <a-button :style="{ marginRight: '8px' }" style="margin-right:8px" @click="onClose">
          <close-outlined />
          取消
        </a-button>
        <a-button type="primary" @click="handleOkFunc">
          <check-outlined />
          保存
        </a-button>
      </div> -->
  </a-modal>
</template>
  <script setup lang="ts">
  import { ref, reactive, defineProps, defineExpose, nextTick, getCurrentInstance, defineEmits } from 'vue'
  const { $infoBox } = getCurrentInstance()!.appContext.config.globalProperties
  const infoTableRef = ref()
  
  const emits = defineEmits(['update:value','closeModal'])
  
  const props = defineProps(['value','needLevel','needProbability','activityTemplateNo','needexchangeNum','errData'])
  
  const searchData = ref({})
  const vdata: any = reactive({
    visible: false, // 弹窗显示状态 true显示 false隐藏
  
    rowKey: 'mchNo',  // 表格行key
    awardMaxNum: 1,  // 奖品最大数量
    awardType: '0,1,2,3',  // 可以选择的奖品类型 0 卡券 1 实物 2 虚拟券 3 福分
    saveObject: {
    },
    errData:[{mchNo:'1',errMsg:'2222'},{mchNo:'2',errMsg:'3333'}],
  
    selectedRowKeys: [],  // 选中要兑换的奖品
    rules: {
      awardLevel: [{ required: true, message: '奖品等级不能为空', trigger: ['blur','change'] }],
      awardProbability: [{ required: true, message: '中奖概率不能为空', trigger: ['blur','change'] }],
      // exchangeShareNum: [{ required: true, message: '奖品兑换所需积分不能为空', trigger: ['blur','change'] }],
      awardType: [{ required: true, message: '奖品类型不能为空', trigger: 'blur' }],
    }
  })


  let tableColums = reactive([
  { key: 'mchNo', title: '商户号', dataIndex: 'mchNo', width: 80, minWidth: 80, maxWidth: 100, fixed: 'left' },
  { key: 'msg', title: '失败原因', dataIndex: 'msg', width: 100, minWidth: 100, maxWidth: 170 },
//   // { key: 'loginUsername', title: '登录账户', dataIndex: 'loginUsername',width: 120, minWidth: 100, maxWidth: 150},
//   { key: 'mchNo', title: '商户号', dataIndex: 'mchNo', width: 150, minWidth: 150, maxWidth: 200, },
//   { key: 'mchName', title: '商户名称', dataIndex: 'mchName', width: 250, minWidth: 250, maxWidth: 300, },
//   { key: 'mchListImage', title: '商户图片', dataIndex: 'mchListImage', width: 120, minWidth: 120, maxWidth: 120, },
//   { key: 'phone', title: '预留手机号', dataIndex: 'phone', width: 150, minWidth: 150, maxWidth: 200, },
//   { key: 'orderSort', title: '是否置顶', dataIndex: 'orderSort', width: 120, minWidth: 120, maxWidth: 200, },
//   // { key: 'contactTel', title: '手机号', dataIndex: 'contactTel', width: 140, minWidth: 140, maxWidth: 170 },
//   // { key: "ifName", title: "当前通道", dataIndex: "ifName", width: 150, minWidth: 150, maxWidth: 250, },
//   // { key: "aliSubmerchantNo", title: "支付宝间连号", dataIndex: "aliSubmerchantNo", width: 180, minWidth: 180, maxWidth: 250, },
//   // { key: "wechatSubmerchantNo", title: "微信间连号", dataIndex: "wechatSubmerchantNo", width: 120, minWidth: 120, maxWidth: 250 },
//   { key: 'state', title: '状态', dataIndex: 'state', width: 80, minWidth: 80, maxWidth: 150 },
//   { key: 'ossRecordId', title: '新老用户', dataIndex: 'ossRecordId', width: 100, minWidth: 100, maxWidth: 150 },
//   { key: 'createdAt', title: '创建日期', dataIndex: 'createdAt', width: 160, minWidth: 200, maxWidth: 230 },
//   { key: 'operation', title: '操作', width: 260, fixed: 'right', align: 'center' }
])

  function show(){
    vdata.errData = [{mchNo:'1',errMsg:'2222'},{mchNo:'2',errMsg:'3333'}]
  }
  
  
  function onClose() {
    console.log('走到了这里点击了x')
    // vdata.visible = false
    emits('closeModal',false)
  }
  
  defineExpose({
    show
  })
  </script>
  
  <style lang="less" scoped>
  :deep(.table-layer .table-search-item) {
    width: calc(100% / 3);
  }
  :deep(.ant-input-number) {
    width: 100%;
  }
  :deep(.ant-input-number-group-wrapper){
    width: 100%;
  }
  </style>